<template>
    <div class="box">
        <div>姓名:{{sname}}</div>
        <div>年龄:{{age}}</div>
        <div>朋友:{{firends?firends.join("、"):""}}</div>
        <div>老师:{{teacher}}</div>
    </div>
</template>

<script>
export default {
    props:{
        sname:{
            type:String,//表示外部传递进来的sname的值必须是String
            required:true,//规定了sname是必须项，要求父组件通过props传递外部数据的时候，必须要传递该参数
        },
        age:{
            type:[Number,String],
            //required:true,
            default:18,
            validator:value=>value>=0&&value<=120
        },
        firends:{
            type:Array,
            default:()=>['路人甲','路人乙']
        },
        teacher:{
            type:Object,
            default:()=>{return {name:'教师1',age:33}}
        }
    }
}
</script>

<style lang="scss">
    .box{
        width: 300px;
        border: 1px solid #000;
        margin: 10px;
        padding: 10px;
    }
</style>